import {onMounted, ref} from 'vue'

import * as $common from "@/utils/common";
import $ from 'jquery';




export  const systemMessages = ref([])
export  const showBodyLeft = ref(true)
export  const imageList = ref([])



export  function changeAside() {
    showBodyLeft.value = !showBodyLeft.value
    mobileRight()
  }

export  function mobileRight() {
    if (showBodyLeft.value && $common.mobile()) {
      $('.body-right').addClass('mobile-right')
    } else if (!showBodyLeft.value && $common.mobile()) {
      $('.body-right').removeClass('mobile-right')
    }
  }

export  function getSystemMessages() {
    // $http.get($constant.baseURL + '/imChatUserMessage/listSystemMessage')
    //   .then((res) => {
    //     if (!$common.isEmpty(res.data) && !$common.isEmpty(res.data.records)) {
    //       systemMessages.value = res.data.records
    //     }
    //   })
    //   .catch((error) => {
    //     ElMessage({
    //       message: error.message,
    //       type: 'error'
    //     })
    //   })
  }

export  function hiddenBodyLeft() {
    if ($common.mobile()) {
      $('.body-right').click(function () {
        showBodyLeft.value = false
        mobileRight()
      })
    }
  }

export  function imgShow() {
    $('.message img').click(function () {
      const src = $(this).attr('src')
      $('#bigImg').attr('src', src)

      /** 获取当前点击图片的真实大小，并显示弹出层及大图 */
      $('<img/>').attr('src', src).load(function () {
        const windowW = $(window).width()// 获取当前窗口宽度
        const windowH = $(window).height()// 获取当前窗口高度
        const realWidth = this.width// 获取图片真实宽度
        const realHeight = this.height// 获取图片真实高度
        let imgWidth, imgHeight
        const scale = 0.8// 缩放尺寸，当图片真实宽度和高度大于窗口宽度和高度时进行缩放

        if (realHeight > windowH * scale) { // 判断图片高度
          imgHeight = windowH * scale// 如大于窗口高度，图片高度进行缩放
          imgWidth = imgHeight / realHeight * realWidth// 等比例缩放宽度
          if (imgWidth > windowW * scale) { // 如宽度仍大于窗口宽度
            imgWidth = windowW * scale// 再对宽度进行缩放
          }
        } else if (realWidth > windowW * scale) { // 如图片高度合适，判断图片宽度
          imgWidth = windowW * scale// 如大于窗口宽度，图片宽度进行缩放
          imgHeight = imgWidth / realWidth * realHeight// 等比例缩放高度
        } else { // 如果图片真实高度和宽度都符合要求，高宽不变
          imgWidth = realWidth
          imgHeight = realHeight
        }
        $('#bigImg').css('width', imgWidth)// 以最终的宽度对图片缩放

        const w = (windowW - imgWidth) / 2// 计算图片与窗口左边距
        const h = (windowH - imgHeight) / 2// 计算图片与窗口上边距
        $('#innerImg').css({top: h, left: w})// 设置top和left属性
        $('#outerImg').fadeIn('fast')// 淡入显示
      })

      $('#outerImg').click(function () { // 再次点击淡出消失弹出层
        $(this).fadeOut('fast')
      })
    })
  }

export  function getImageList() {

    console.log("getImageList")
    // $http.get($constant.baseURL + '/resource/getImageList')
    //   .then((res) => {
    //     if (!$common.isEmpty(res.data)) {
    //       imageList.value = res.data
    //     }
    //   })
    //   .catch((error) => {
    //     ElMessage({
    //       message: error.message,
    //       type: 'error'
    //     })
    //   })
  }

export  function parseMessage(content) {
    content = content.replace(/\n{2,}/g, '<div style="height: 12px"></div>')
    content = content.replace(/\n/g, '<br/>')
    content = $common.faceReg(content)
    content = $common.pictureReg(content)
    return content
  }


